html,
body {
    height: 100%;
    width: 100%;
}

.box {
    height: 100%;
    width: 100%;
    background-image: url(../data/img/logo.jpg);
    background-repeat: no-repeat;
    background-size: 100% 100%;

    .top {
        height: 150px;
        text-align: center;
        background-color: #7AB5E9;

        h1 {
            font-size: 55px;
            line-height: 150px;
            font-weight: 600;
            color: white;
        }
    }

    .left {

        padding-top: 20px;
        box-sizing: border-box;
        height: calc(100% - 150px);
        width: 250px;
        float: left;
        color: white;
        background-color: #417EC8;

        .yiji {
            >li {
                padding: 10px 0;
                padding-left: 20px;
                box-sizing: border-box;
                line-height: 40px;
                margin-top: 10px;

                cursor: pointer;
                border-top: 1px solid #498bd7;
                border-bottom: 1px solid #2869bd;

                h2 {
                    font-size: 20px;
                    line-height: 40px;


                }

                ul {
                    display: none;

                    li {
                        padding-left: 20px;
                        border-top: 1px solid #498bd7;
                        border-bottom: 1px solid #2869bd;
                        width: 100%;
                        height: 30px;
                        font-size: 18px;
                        line-height: 20px;
                        margin-top: 10px;
                        color: rgba(255, 255, 255, 0.822);
                        box-sizing: border-box;
                    }
                }

            }
        }
    }

    .right {
        width: calc(100% - 250px);
        height: calc(100% - 150px);
        float: right;
        background-color: white;
        position: relative;

        img {
            height: 100%;
            width: 100%;
        }

        h1 {
            font-size: 50px;
            position: absolute;
            font-weight: 600;
            left: calc(50% - 200px);
            top: calc(50% - 25px);
            z-index: 2;
            color: white;
        }


        .weixiu {

            .supervisor_t {

                width: 100%;
                height: 60px;
                background-color: rgb(204, 204, 204);
                padding-top: 15px;
                box-sizing: border-box;

                .apply {
                    margin-top: 5px;
                    padding: 3px 5px;
                    height: 30px;
                    font-size: 18px;
                    margin-left: 7%;
                }

                .lable1 {
                    margin-left: 20%;
                }

                #select {
                    height: 30px;
                    width: 120px;
                    font-size: 20px;
                    text-align: center;
                }

                .shuru {
                    height: 30px;
                    width: 180px;
                    padding-left: 10px;
                    border-radius: 10px;
                    outline: none;
                }

                .chaxun {
                    font-size: 20px;
                    line-height: 30px;
                    height: 30px;
                    width: 50px;
                    margin-left: 15px;
                }

                .all {
                    font-size: 20px;
                    line-height: 30px;
                    height: 30px;
                    width: 100px;
                    margin-left: 15%;
                }




            }

            .addapply {
                display: flex;
                display: none;

                .zzc {
                    height: calc(100% - 60px);
                    width: 100%;
                    position: absolute;
                    background-color: rgba(17, 16, 16, 0.3);



                    #studentform {
                        position: absolute;
                        box-shadow: 0 0 5px 5px white;
                        left: 0;
                        top: 0;
                        height: 60%;
                        width: 40%;
                        background-color: rgb(238, 231, 231);
                        padding-top: 20px;
                        box-sizing: border-box;

                        p:first-child {
                            font-size: 20px;
                            line-height: 20px;
                            font-weight: 600;
                            color: #2869bd;
                            text-align: center;
                        }

                        .yz {
                            margin: auto;
                            height: 30px;
                            width: 320px;
                            font-size: 20px;
                            line-height: 30px;
                            margin-top: 10px;
                            text-align: justify;
                            display: flex;
                            justify-content: space-between;

                            input {
                                height: 100%;
                                width: 200px;
                                padding-left: 8px;
                                ;
                                box-sizing: border-box;
                            }
                        }

                        p:nth-child(3) {
                            display: flex;
                            justify-content: space-between;
                            margin: auto;
                            width: 340px;
                            font-size: 18px;
                            line-height: 30px;
                            margin-top: 10px;
                            position: relative;
                            outline: none;

                        }

                        P:last-child {
                            padding: 0 30px;
                            box-sizing: border-box;

                            button {
                                font-size: 18px;
                                padding: 10px;
                                margin-top: 20px;
                                margin-left: 30%;

                            }

                            span {
                                display: inline-block;
                                font-size: 18px;
                                padding: 10px;
                                margin-top: 20px;
                                background-color: #EFEFEF;
                            }
                        }
                    }
                }

            }

            .supervisor_f2 {
                table {
                    width: 100%;
                    border: 1px solid #ccc;
                    border-spacing: 0;

                    tr {
                        width: 100%;
                        height: 30px;
                        border: 1px solid #ccc;

                        th {
                            background-color: #e4dbdb;
                        }

                        td {
                            user-select: none;
                            border: 1px solid #ccc;
                            height: 30px;
                            width: 12%;
                            text-align: center;

                            .sq {
                                height: 25px;
                                line-height: 20px;
                                padding: 0 5px;
                                background-color: red !important;
                            }

                            .sl {
                                height: 25px;
                                line-height: 20px;
                                padding: 0 5px;
                                background-color: rgb(0, 255, 98) !important;
                            }

                            .wc {
                                height: 25px;
                                line-height: 20px;
                                padding: 0 5px;
                                background-color: rgb(68, 0, 255);
                            }

                            .bh {
                                height: 25px;
                                line-height: 20px;
                                padding: 0 5px;
                                background-color: yellow;
                                color: white;
                            }

                            button {
                                cursor: pointer;
                            }
                        }
                    }

                    tr:nth-child(even) {
                        background-color: #e4dbdb;
                    }

                }
            }
        }
    }
}